<template>
  <div class="app-container">
    <el-card class="content-edit">
      <div slot="header">编辑用户</div>
      <el-form ref="form" :model="form" label-width="130px">
        <el-form-item label="ID">{{ form['numberId'] }}</el-form-item>
        <el-form-item label="头像">
          <ws-show-img :src="form['avatar']" style="width: 128px;height: 128px;"/>
        </el-form-item>
        <el-form-item label="昵称">{{ form['nickname'] }}</el-form-item>
        <el-form-item label="性别">{{ form['genderText'] }}</el-form-item>
        <el-form-item label="注册时间">{{ form['registerTime'] }}</el-form-item>
        <el-form-item label="状态">
          <el-select v-model="form['status']" placeholder="请选择">
            <el-option :value="1" label="已启用"/>
            <el-option :value="2" label="已冻结"/>
            <el-option :value="3" label="已注销"/>
          </el-select>
        </el-form-item>
        <el-form-item label="手机号码">
          <el-input v-model="form['mobile']"/>
        </el-form-item>
        <el-form-item label="邮箱">
          <el-input v-model="form['email']"/>
        </el-form-item>
        <el-form-item label="联系地址">
          <el-input v-model="form['address']"/>
        </el-form-item>
        <el-form-item label="卡券数">{{ form['couponCount'] }}张</el-form-item>
        <el-form-item label="已使用卡券数">{{ form['useCouponCount'] }}张</el-form-item>
        <el-form-item label="发票已开">{{ form['invoiceCount'] }}张</el-form-item>
        <el-form-item label="总消费">{{ form['amount'] }}元</el-form-item>
        <el-form-item label="最近消费时间">{{ form['recentConsumptionTime'] }}</el-form-item>
        <el-form-item label="备注信息">
          <el-input v-model="form['remark']" type="textarea" rows="3" maxlength="50"/>
        </el-form-item>
        <el-form-item label="用户身份">
          <el-radio-group v-model="form['userType']">
            <el-radio :label="0">普通用户</el-radio>
            <el-radio :label="1">司机</el-radio>
            <el-radio :label="2">核销员</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item>
          <el-button :loading="loading" type="primary" @click="onSubmit">保存</el-button>
          <el-button @click="$router.back()">取消</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
  export default {
    name: 'UserAdd',
    data() {
      return {
        loading: false,
        form: {
          id: null,
          // 用户id
          numberId: '',
          // 用户身份
          userType: 0
        }
      }
    },
    mounted(){
      this.form['id'] = this.$router.currentRoute.query['id'] || '';
      this.loadData();
    },
    methods: {
      // 加载用户信息
      loadData(){
        (async () => {
          const result = await this.$service.applicationCustomerGetDetailsById({id: this.form['id']});
          if (result.code === 0) {
            const data = Object.assign({}, result.data);
            Object.assign(this.form, data);
          }
        })();
      },
      // 提交
      onSubmit() {
        this.$refs.form.validate(valid => {
          if (valid) {
            this.loading = true;
            (async () => {
              const params = Object.assign({}, this.form);
              const result = await this.$service.applicationCustomerInfoUpdate(params);
              this.loading = false;
              if (result.code === 0) {
                if (result.data['isError'] === 1) {
                  this.$confirm('信息修改成功, 设置为司机失败, 该手机号未创建司机信息, 是否立即前往创建?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                  }).then(() => {
                    this.$router.push(`/preset/driver/add?userId=${this.form['id']}`);
                  }).catch(() => {
                    this.$message({
                      type: 'info',
                      message: '设置为司机失败~'
                    });
                  });
                } else if (result.data['isError'] === 2) {
                  this.$confirm('信息修改成功, 设置为核销员失败, 该手机号未创建核销员信息, 是否立即前往创建?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                  }).then(() => {
                    this.$router.push(`/preset/verifier/add?userId=${this.form['id']}`);
                  }).catch(() => {
                    this.$message({
                      type: 'info',
                      message: '设置为司机失败~'
                    });
                  });
                } else {
                  this.$message.success('操作成功~');
                  this.$router.back();
                }
              } else {
                this.$message.error(result.msg);
              }
            })();
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      }
    }
  }
</script>
